<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
		<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
		<link rel="stylesheet" href="/css/font.css">
		<link rel="stylesheet" href="/css/xadmin.css">
	</head>
	<body>
		<div class="x-nav">
			<span class="layui-breadcrumb">
				<a href="#">管理员账号管理</a>
			</span>
			<a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);"
			 title="刷新">
				<i class="layui-icon" style="line-height:30px">ဂ</i></a>
		</div>
		<div class="x-body" id="app">
			<xblock>
				<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
				<button class="layui-btn" onclick="open_addSysUser()"><i class="layui-icon"></i>添加管理员</button>
				<span class="x-right" style="line-height:40px">共有数据：{{ sysUsers.length }} 条</span>
			</xblock>
			<table class="layui-table">
				<thead>
					<tr>
						<th width="20">
							<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
						</th>
						<th width="80">用户姓名</th>
						<th width="100">登录账号</th>
						<th width="100">邮箱</th>
						<th width="100">电话</th>
						<th width="350">操作</th>
				</thead>
				<tbody>
					<tr v-for="(sysUser,index) in sysUsers">
						<td>
							<div class="layui-unselect layui-form-checkbox" lay-skin="primary" :data-id="sysUser.id" :data-username="sysUser.username" ><i class="layui-icon">&#xe605;</i></div>
						</td>
						<td>{{ sysUser.username }}</td>
						<td>{{ sysUser.account }}</td>
						<td>{{ sysUser.email }}</td>
						<td>{{ sysUser.phone }}</td>
						<td class="td-manage">
							<button class="layui-btn layui-btn layui-btn-sm" onclick="open_editSysUser(this)"><i class="layui-icon">&#xe642;</i>编辑</button>
							<button class="layui-btn layui-btn layui-btn-sm" onclick="open_editPassword(this)"><i class="layui-icon">&#xe642;</i>修改密码</button>
							<button class="layui-btn layui-btn layui-btn-sm" onclick="open_editAcl(this)"><i class="layui-icon">&#xe642;</i>权限设置</button>
							<button class="layui-btn-danger layui-btn layui-btn-sm" onclick="member_del(this)" href="javascript:;"><i
								 class="layui-icon">&#xe640;</i>删除</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
		<script type="text/javascript" src="/js/jquery.min.js"></script>
        <script type="text/javascript" src="/lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="/js/xadmin.js"></script>
		<script type="text/javascript" src="/js/vue.min.js"></script>
        <script type="text/javascript" src="/js/jquery.form.js"></script>
		<script>
		
			var vm = new Vue({
	            el : '#app',
	            data : {
	                sysUsers:""
	            },
	            created : function() {
	                // 获取学校通知消息
	                this.listSysUser();
	            },
	            methods : {
	            	listSysUser() {
	                    var vm = this;
	                    $.ajax({
	                        url : "/sys/sysUser/listSysUser",
	                        type : "get",
	                        success : function(result) {
	                            if (result.state) {
	                                vm.sysUsers = result.data;
	                            } else {
	                                layui.use(['layer'], function(){
	                                    var layer = layui.layer
	                                    layer.msg(""+result.msg, {icon: 5});
	                                });
	                            }
	                        }
	                    });
	                }
	            }
	        });
			
			// 添加管理员
            function open_addSysUser() {
                x_admin_show('添加管理员','/sys/sysUser/toSysUser_add', 600, 430);
            }
            // 编辑管理员
            function open_editSysUser(obj) {
            	var sysUserId = $(obj).parents("tr").find("div:first").attr("data-id");
            	var username = $(obj).parents("tr").find("div:first").attr("data-username");
                x_admin_show('编辑['+username+']','/sys/sysUser/toSysUser_edit?sysUserId=' + sysUserId, 600, 360);
            }
            // 修改密码
            function open_editPassword(obj) {
            	var sysUserId = $(obj).parents("tr").find("div:first").attr("data-id");
            	layer.open({
                    type: 2, // 2:url请求
                    title: '修改密码',
                    skin: 'layui-layer-rim', // 加上边框
                    area: ['420px', '240px'], // 宽高
                    content: ["/sys/sysUser/toSysUser_updatePas?sysUserId=" + sysUserId,"no"] // 禁用滚动条
                });
            }
            
            // 打开权限管理
            function open_editAcl(obj) {
            	var sysUserId = $(obj).parents("tr").find("div:first").attr("data-id");
                var username = $(obj).parents("tr").find("div:first").attr("data-username");
            	x_admin_show('权限管理['+username+']','/sys/sysUser/toSysUser_aclTree?sysUserId=' + sysUserId, 650, 400);
            }
            
			// 单个删除
			function member_del(obj) {
				var username = $(obj).parents("tr").find("div:first").attr("data-username");
				var id = $(obj).parents("tr").find("div:first").attr("data-id");
				var sysUserIds = [];
				sysUserIds.push(id);
				layer.confirm('确认要删除【' + username + '】吗？', function(index) {
					$.ajax({
						url: "/sys/sysUser/delSysUser",
						type: "post",
						data: {
							sysUserIds: sysUserIds
						},
						success: function(result) {
							if (result.state) {
								layer.msg('删除成功!', {
									icon: 1,
									time: 1000
								});
								vm.listSysUser();
							} else {
								layer.msg("" + result.msg, {
									icon: 5
								});
							}
						}
					});
				});
			}

			// 批量删除
			function delAll(argument) {
				var sysUserIds = tableCheck.getData();
				if (sysUserIds.length <= 0) {
					return;
				}
				// 获取选中的管理员用户姓名
				var obj = $(".layui-form-checked").not('.header');
				var username = [];
				obj.each(function(index, el) {
					username.push(obj.eq(index).attr('data-username'));
				});
				layer.confirm('确认要删除【' + username + '】吗？', function(index) {
					$.ajax({
						url: "/sys/sysUser/delSysUser",
						type: "post",
						data: {
							sysUserIds: sysUserIds
						},
						success: function(result) {
							if (result.state) {
								layer.msg('删除成功', {
									icon: 1
								});
								// 移除所有checkbox的勾选状态
								$(".layui-form-checkbox").removeClass('layui-form-checked');
								vm.listSysUser();
							} else {
								layer.msg("" + result.msg, {
									icon: 5
								});
							}
						}
					});
				});
			}
			// 回调
			function updateData() {
				 vm.listSysUser();
			}
		</script>
	</body>

</html>
